import type { Component } from 'vue'
import { NIcon } from 'naive-ui'
import { computed, h } from 'vue'
import { LogOutOutline as LogoutIcon } from '@vicons/ionicons5'
import { useAuthStore } from '@/stores/user'
import { useRouter } from 'vue-router'
import { useMessage } from 'naive-ui'

function renderIcon(icon: Component) {
  return () => h(NIcon, null, { default: () => h(icon) })
}

export const getShowOptions = () => {
  const authStore = useAuthStore()
    const router = useRouter()
    const message = useMessage()

  return [
    {
      label: computed(() => authStore.displayName),
      key: 'username',
      props: {
          onClick: () => {
              label: authStore.displayName
        },
      },
    },
    {
      label: '退出登录',
      key: 'logout',
      icon: renderIcon(LogoutIcon),
      props: {
        onClick: () => {
          authStore.logout()
          router.push('/login')
          message.success('退出登录成功')
        },
      },
    },
  ]
}
